<template>
  <div>
    <tree-select
      v-if="lastStage"
      v-model="departValue"
      :options="departmentList"
      :props="{
        label: 'treedatacodeandname',
        value: treeValue,
        children: 'childList'
      }"
      :disabled="disabled"
      filterable
      last-level="blnisdetail"
      info-error="请选择末级"
      :style="{width: typeof width === 'number' ? `${width}px` : width}"
      @input="onChange"
    />
    <tree-select
      v-else
      v-model="departValue"
      :options="departmentList"
      :props="{
        label: 'treedatacodeandname',
        value: treeValue,
        children: 'childList'
      }"
      :disabled="disabled"
      :style="{width: typeof width === 'number' ? `${width}px` : width}"
      filterable
      @input="onChange"
    />
  </div>
</template>

<script>
import { getDepartment } from '@/api/common/common'
export default {
  name: 'DepartmentTreeSelect',
  props: {
    value: {
      type: [String, Number],
      default: ''
    },
    // 宽度
    width: {
      type: [String, Number],
      default: 190
    },
    // 是否末级 默认是末级
    lastStage: {
      type: Boolean,
      default: true
    },
    // 是否禁用
    disabled: {
      type: Boolean
    },
    productId: {
      type: [String, Number],
      default: 315
    },
    isImmediate: {
      type: Boolean,
      default: true
    },
    // value值
    treeValue: {
      type: String,
      default: 'treedataid'
    }
  },
  data() {
    return {
      departmentList: []
    }
  },
  computed: {
    departValue: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    }

  },
  watch: {
    productId() {
      this.getDepartment()
    }
  },
  created() {
    if (this.isImmediate) {
      this.getDepartment()
    }
  },
  methods: {
    onChange(val) {
      this.$emit('change', val)
    },
    getDepartment() {
      getDepartment({
        lngproductid: this.productId,
        privilege: false
      }).then(res => {
        if (res.code === 20000) {
          this.departmentList = res.data
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
